import { Router, Route, Link, Switch, Redirect } from 'react-router-dom';
import { isAuth, customHistory } from './utils';

// 页面
import Login from '@/pages/Login';
import GeekLayout from '@/pages/GeekLayout';
import NotFound from '@/pages/NotFound';

// 根组件样式
import './App.scss';

const App = () => {
  return (
    <Router history={customHistory}>
      <div className={'app'}>
        <Switch>
          <Route exact path={'/'} render={() => <Redirect to={'/home'} />} />
          <Route path={'/login'} component={Login} />
          {/* <Route path={'/home'} component={GeekLayout} /> */}
          <Route
            path={'/home'}
            render={(props) => {
              // console.log('home 组件的 props=>', props);
              // console.log(
              //   'home 组件的 props=>',
              //   props.history.location === props.location
              // );
              // 在home组件渲染前执行的代码
              if (isAuth()) {
                return <GeekLayout />;
              } else {
                return (
                  <Redirect
                    to={{
                      pathname: '/login', // 重定向后要去的页面
                      state: {
                        // 重定向前的页面相关信息
                        from: props.location.pathname,
                      },
                    }}
                  />
                );
              }
            }}
          />
          <Route component={NotFound} />
        </Switch>
      </div>
    </Router>
  );
};

export default App;
